

.cart_header{
    width: 100%;
    height: 102px;
    border-top: 1px solid #E6E6E6;
    border-bottom: 1px solid #E6E6E6;
    .wrap{
        width: 1190px;
        height: 102px;
        margin: 0 auto;
        .left{
            display: block;
            float: left;
            width: 305px;
            height: 66px;
            margin-top: 18px;
        }
        .purchase-steps{
            float: right;
            width: 444px;
            height: 42px;
            margin-top: 30px;
            font-family: "Microsoft Yahei", sinsum, sans-serif;
            font-size: 12px;
            .step-first{
                position: relative;
                float: left;
                width: 81px;
                padding-top: 21px;
                i{
                    width: 81px;
                    text-align: left;
                }
            }
            .step{
                position: relative;
                float: left;
                width: 141px;
                padding-top: 21px;
                span{
                    background-position:0 -21px;
                }
                i{
                    width: 141px;
                    text-align: center;
                    color: #999;
                }
            }
            .step-last{
                position: relative;
                float: left;
                width: 81px;
                padding-top: 21px;
                span{
                    background-position: 0 -63px;
                }
                i{
                    width: 81px;
                    text-align: right;
                    color: #999;
                }
            }
            span{
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 21px;
                background: url(/images/icon-steps_2951b6aa03.png) 0 0 no-repeat;
            }            
            b{
                position: absolute;
                top: 0;
                width: 20px;
                height: 21px;
                line-height: 21px;
                font-family: Arial, sans-serif;
                font-weight: 700;
                font-size: 14px;
                color: #fff;
                text-align: center;
            }
            i{
                display: block;
                font-style:normal ;
                color: #00a4ed;
            }
        }
    }
}
//购物车主体
.cart_container{
    width: 100%;
    background: #f5f5f5;
    .wrap{
        width: 1190px;
        margin: 0 auto;
        overflow: hidden;
        .hidden{display: none !important;}
        .empty{            
            width: 1190px;
            height: 300px;
            margin-top: 20px;
            margin-bottom: 20px;
            background: #fff;
            border: 1px solid #E6E6E6;
            display: flex;
            justify-content: center;
            align-items: center;
            .context{
                width: 315px;
                height: 60px;
                .cart{
                    width: 94px;
                    height: 60px;
                    float: left;
                }
                .right{
                    float: left;
                    width: 221px;
                    height: 60px;
                    p:first-child{ 
                        width: 221px; 
                        height: 20px;
                        margin-top: 13px;
                        font-size: 12px;
                        color: #333333;
                        strong{
                            font-size: 18px;
                        }
                    }
                    p:last-child{
                        width: 221px;
                        height: 12px;
                        margin-top: 13px;
                        font-size: 12px;
                        color: #333333;
                    }
                }              
            }
        }
        
        //购物车不为空时
        .not-empty{
            width: 1190px;            
            margin-top: 30px;
            background: #f5f5f5;
            border: 1px solid #E6E6E6;
            .t_head{
                width: 1190px;
                height: 66px;
                background: #f5f5f5;              
                .cart-title{
                    width: 80px;
                    height: 25px;
                    background: #00a4ed;
                    font-size: 15px;
                    color: #fff;
                    text-align: center;
                    line-height: 25px;
                }
                .t_head_context{
                    width: 1190px;
                    background: #fff;
                    height: 40px;
                    border-top: 1px solid #00a4ed;
                    font-size:12px ;
                    ul{
                        width: 1190px;
                        display: flex;
                        justify-content: space-around;
                        li{
                            height:40px;
                            line-height: 40px;
                            color: #333;                                                     
                        }
                    }
                    
                }
            }
            .t_container{
                width: 1190px;
                height: 198px;
                background: #fff;
                margin-top: 20px;
                margin-bottom: 20px;
                overflow: hidden;
                .context{
                    width: 1140px;
                    height: 182px;
                    margin-top: 14px;
                    margin-left: 27px;
                    .top{
                        width: 1140px;
                        height: 40px;
                        border-bottom: 1px solid #E6E6E6;
                        font-size: 12px;
                        color: #333;
                        input{
                            width: 15px;
                            height: 15px;
                        }
                        span{
                            margin: 0 10px;
                        }
                        i{
                            font-style:normal ;
                        }
                    }
                    .middle{
                        width: 1140px;
                        height: 110px;
                        border-bottom: 1px solid #E6E6E6;
                        font-size: 12px;
                        color: #333;
                        ul{
                            width: 1190px;
                            
                            li{
                                height: 40px;
                                line-height: 40px;
                                float: left;
                                color: #333;                                                     
                            }
                            li:first-child span{
                                display: block;
                                width: 15px;
                                height: 15px;
                                margin-top: 40px;
                            }
                            li:first-child{
                               width: 15px;
                                height: 15px;
                                margin-top: 40px; 
                            }
                            li:nth-child(2){
                                width: 70px;
                                height: 70px;
                                margin-left: 15px;
                                margin-top: 20px;
                                border: 1px solid #E6E6E6;
                            }
                            li:nth-child(3){
                                width: 220px;
                                height: 32px;
                                line-height: 32px;
                                margin-top: 20px;
                                margin-left: 15px;
                            }
                            li:nth-child(4){
                                width: 70px;
                                height: 12px;
                                line-height: 12px;
                                margin-left: 32px;
                                margin-top: 32px;
                            }
                            li:nth-child(5){
                                width: 84px;
                                height: 12px;
                                line-height: 12px;
                                margin-left: 94px;
                                margin-top: 32px;
                            }
                            li:nth-child(6){
                                width: 98px;
                                height: 25px;
                                margin-top: 26px;
                                margin-left: 67px;
                                .increment,.decrement{
                                    cursor: pointer;
                                    display: block;
                                    width: 25px;
                                    height: 25px;
                                    border: 1px solid #E6E6E6;
                                    float: left;
                                    text-align: center;
                                    line-height: 25px;
                                }
                                input{
                                    float: left;
                                    display: inline-block;
                                    width: 40px;
                                    height: 23px;
                                    line-height: 23px;
                                    text-align: center;
                                    font-weight: 600;
                                }
                               
                            } 
                            li:nth-child(7){
                                width: 90px;
                                height: 12px;
                                line-height: 12px;
                                margin-left: 98px;
                                margin-top: 32px;
                            }
                            li:last-child{
                                cursor: pointer;
                                width: 90px;
                                height: 12px;
                                line-height: 12px;
                                margin-left: 95px;
                                margin-top: 32px;
                                color: #999;
                            }
                            
                        }
                    }
                    .bottom{
                        width: 1190px;
                        height: 44px;
                        span{
                            display: block;
                            float: left;
                            font-size: 12px;
                            color: #333;
                            margin: 16px 27px;
                        }
                    }
                }
            }
          .t_count{
                width: 1190px;
                height: 70px;
                background: #fff;               
                margin-bottom: 20px;
                overflow: hidden;
                .cart-foot{
                    width: 1140px;
                    height: 50px;
                    margin: 12px auto;
                    font-size: 12px;
                    color: #333333;
                    text-align: center;
                    .checkbox{
                        width: 43px;
                        height: 15px;
                        margin-top: 18px;
                        float: left;                      
                        input{
                            width: 15px;
                            height: 15px;                           
                        }
                    }
                    .total-infos{
                        width: 517px;
                        height: 50px;
                        float: right;
                        .infos-wrap{
                            width: 376px;
                            height: 50px;
                            float: left;
                            p{
                                text-align: right;
                                height: 23px;
                                line-height: 23px;
                                .total-quantity{
                                    font-weight: 600;
                                    color: red;
                                }
                                .integer{
                                    font-weight: 16px;
                                    color: red;
                                }
                                span{
                                    margin:0 4px;
                                }
                            }
                        }
                      .submit-all{
                          width: 120px;
                          height: 50px;
                          background: red;
                          font-size: 16px;
                          color: #fff;
                          text-align: center;
                          line-height: 50px;
                          float: right;
                          border: none;
                      }  
                    }
                }
          }  
        }
    }
}
